<script setup>
import { ref } from 'vue';
import Tc from './TeleportChild.vue';

defineProps({
  msg: String
})

const modalOpen = ref(false)
</script>

<template>
    <button @click="modalOpen = true">
        Open full screen modal! (With teleport!)
    </button>

    <teleport to="body">
      <div v-if="modalOpen" class="modal">
        <div>
          I'm a teleported modal! 
          (My parent is "body")
          <button @click="modalOpen = false">
            Close
          </button>
        </div>
        <Tc name="pzl" />
      </div>
    </teleport>

    <teleport to="body">
      <div>999999</div>
    </teleport>
</template>